<template>
    <div class="sub-search">
        <el-row type="flex" justify="space-around">
            <el-col :span="18">
                <el-form :inline="true" :model="form" class="demo-form-inline">
                    <el-form-item :label="title+'名称'">
                        <el-input v-model="form.subjectName"></el-input>
                    </el-form-item>
                    <el-form-item label="状态" v-if="title !== '学科'">
                        <el-select v-model="form.state" placeholder="请选择">
                            <el-option label="启用" value="1"></el-option>
                            <el-option label="禁用" value="2"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="default" @click="onClear">清除</el-button>
                        <el-button type="primary" @click="clickSearch">搜索</el-button>
                    </el-form-item>
                </el-form>
            </el-col>
            <el-col :span="6">
                <el-row type="flex" justify="end">
                    <el-button v-if="$route.query.id" type="text" icon="el-icon-back" @click="$router.push('/subjects/list')">返回学科</el-button>
                    <el-button type="success" icon="el-icon-edit" @click="$emit('add')">新增{{title}}</el-button>
                </el-row>
            </el-col>
        </el-row>
    </div>
</template>
<script>
export default {
  props: {
    title: {
      type: String,
      required: true
    }
  },
  data () {
    return {
      form: {
        subjectName: '',
        state: null
      }
    }
  },
  methods: {
    onClear () {
      // if (this.form.subjectName) {
      //   this.$emit('clear')
      // }
      this.form = {
        subjectName: '',
        state: null
      }
    },
    clickSearch () {
      if (this.title === '学科') {
        this.$emit('search', this.form.subjectName)
      } else if (this.title === '目录') {
        this.$emit('search', { directoryName: this.form.subjectName, state: this.form.state, subjectID: +this.$route.query.id || null })
      } else if (this.title === '标签') {
        this.$emit('search', { tagName: this.form.subjectName, state: this.form.state, subjectID: +this.$route.query.id || null })
      }
    }
  }
}
</script>
<style lang="scss">
</style>
